<%@ page language="java" import="java.util.*" pageEncoding="utf-8" contentType="text/html; charset=utf-8"%>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page import="com.zm.jdbc.*" import="com.zm.entity.*" import="java.net.*" %>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
 
    
    <title>My JSP 'TagTst.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<style>
	  
	</style>
	<script>
	      
	      var request=getXMLHttpRequest();
	      
	      function getXMLHttpRequest(){
	          
	          if(XMLHttpRequest)
	            return new XMLHttpRequest();
	          else if(ActiveXObject)
	             return new ActiveXObject("Microsoft.XMLHTTP");
	       
	      }
	           
	      function filter(form){
	      
	           request.onreadystatechange=function(){
	               if(request.readyState==4){
	                    if(request.status==200){
	                         var info=document.getElementById("info");
	                         info.innerHTML="";
	                         var xml=request.responseXML;
	                         var items=xml.getElementsByTagName("item");
	                         if(items.length!=0){ 
	                                 var trh=document.createElement("tr");
	                                 trh.innerHTML="<th>姓名</th><th>性别</th><th>年龄</th><th>联系方式</th><th>薪水</th><th>状态</th><th>操作1</th><th>操作2</th>";
	                                 info.appendChild(trh);
	                                 for(var i=0;i<items.length;i++){
	                                         var tr=document.createElement("tr");
	                                         var columns=items[i].childNodes;
	                                         for(var j=0;j<columns.length;j++){
	                                                if(columns[j].nodeType==1){
	                                                      var td=document.createElement("td");
	                                                       td.innerHTML=columns[j].innerHTML;
	                                                       tr.appendChild(td);
	                                                }
	                                         }
	                                         var a1=document.createElement("td");
	                                         a1.innerHTML="<a href='ChangeJsp.jsp'>修改</a>"
	                                         var a2=document.createElement("td");
	                                         a2.innerHTML="<a href='servlet/TestServlet' onclick='return deleteinfo(this)'>删除</a>";
	                                         tr.appendChild(a1);
	                                         tr.appendChild(a2);
	                                         info.appendChild(tr);
	                                 }
	                       }
	                       autoFlush();
                       }
	              }
	           
	           }
	          
	           request.open("get","servlet/TestServlet?name="+document.getElementById("name").value+"&method=select&flag=asyn",true);
	           
	           request.send(null);
	          
	      
	      }
	      
	      function deleteinfo(a){
	         var tr=a.parentNode.parentNode;
	         var tds=tr.childNodes;
	         var name="";
	         for(var i=0;i<tds.length;i++){
	            if(tds[i].nodeType==1){
	               name=tds[i].innerHTML;
	               break;
	              }
	         }
		     var result=confirm("删除？");
		     if(result==true){
		      
		          request.onreadystatechange=function(){
		                if(request.readyState==4){
		                   if(request.status==200){
		                        var text=request.responseText;
		                        if(text.indexOf("deleted")!=-1)
		                          
		                              a.parentNode.parentNode.style.display="none";
		                        }
		                        autoFlush();
		                   }
		           }
		           request.open("GET",a.href+"?name="+name+"&flag=asyn&method=delete",true);
		           request.send(null);
		        }
		         return false; 
		      }
		      
		      function autoFlush(){
		                   //创建一个日期变量和一个时间变量
		                   var tempTime = new Date();
		                   var tempParameter = tempTime.getTime();
	                       request.onreadystatechange = processor;
		                   //这里放置一个时间型参数是为了让服务器知道这是一个新的请求
		                   request.open("GET", "servlet/TestServlet?method=fordiagram&rnd="+tempParameter);
		                   //发送请求
		                   request.send(null);
	          }
	
	          //处理从服务器返回的XML文档
	        function processor() {
		            //定义一个变量用于存放从服务器返回的响应结果
		            var result;
		            if(request.readyState == 4) { //如果响应完成
			               if(request.status == 200) {//如果返回成功
				             //取出服务器返回的XML文档的所有counter标签的子节点
				               result = request.responseXML.getElementsByTagName("item");
				             //解析XML中的数据并更新统计图状态
			        	      for(var i=0;i<result.length;i++){
					       //用相应的统计数据更新统计图片的状态
					               document.getElementById("bar"+i).height = result[i].firstChild.nodeValue;
				              }
			                }
		            }
	        }               
	                       //每隔一秒就执行一次autoFlush方法
	                 // setInterval("autoFlush();",1000);
	      
	      
	       
	      
	      
	      
	      
	      
	    
	
	</script>
  </head>
  
  <body>
     <jsp:include page="LogoutJsp.jsp"/>
     
    
        
         
   <table id="layout" border="5px"  cellspacing="40px" cellpadding="20px" >
       <tr>
         <td>
          <form  action="servlet/TestServlet" onsubmit="filter(this);return false;">
            <input type="text" name="name" id="name"/> 
            <input type="hidden" name="method" value="select"/> 
            <input type="submit" value="查询"/>
          </form>
          
          <table border="1px" id="info" >
             <tr>
                <th>姓名</th>
                 <th>性别</th>
                  <th>年龄</th>
                   <th>联系方式</th>
                    <th>薪水</th>
                     <th>状态</th>
                     <th>操作1</th>
                      <th>操作2</th>
             
             </tr>
             
             <!--  
           <c:forEach items="${sessionScope.list}"  var="x">
             <tr>
                 <td>${x.name}</td>
                 <td>${x.sex}</td>
                 <td>${x.age}</td>
                 <td>${x.telnum}</td>
                 <td>${x.salary}</td>
                 <td>${x.status}</td>
                 <td><a href="ChangeJsp.jsp?name=${x.name}&passwd=${x.passwd}&age=${x.age}&sex=${x.sex}&telnum=${x.telnum}">修改</a></td>
				<td><a href="servlet/TestServlet?name=${x.name}&method=delete" onclick="return deleteinfo(this)">删除</a></td>
             </tr> 
          </c:forEach> -->
          
          
         </table>
       </td>
     <!--  <td>    
        <form action="servlet/TestServlet">
         <table>
          <tr><td></td><td><input type="hidden" value="update" name="method"/></td></tr>
          <tr><td></td><td><input type="hidden" value="" name="oldname"/></td></tr>
          <tr><td>name:</td><td><input type="text" value="" name="name"/></td><td><font></font></td></tr>
          <tr><td>passwd:</td><td><input type="text" value="" name="passwd"/></td></tr>
          <tr><td>age:</td><td><input type="text" value="" name="age"/></td></tr>
          <tr><td>telnum:</td><td><input type="text" value="" name="telnum"/></td></tr>
          <tr>
              <td>sex:</td>
              <td><select name="sex">
                    <option value="男">男</option>
                    <option value="女">女</option>
                   </select></td>
          </tr>
          
     </table>
         <input type="submit" value="更改"/>
         <input type="reset" value="重置"/>
     
     </form>
      </td> -->
      
      <td>
      <TABLE border="0" bgcolor="#c0c0c0" width="360px" cellpadding="5px">
	<TR>
		<TD colspan="6" align="center"><h2>指标动态统计图</h2></TD>
	</TR>
	<TR height="100" align="center" valign="bottom">
		<TD><img id="bar0" src="images/bar0.gif" width="20"></TD>
		<TD><img id="bar1" src="images/bar1.gif" width="20"></TD>
		<TD><img id="bar2" src="images/bar2.gif" width="20"></TD>
		<TD><img id="bar3" src="images/bar3.gif" width="20"></TD>
		<TD><img id="bar4" src="images/bar4.gif" width="20"></TD>
		<TD><img id="bar5" src="images/bar5.gif" width="20"></TD>
	</TR>
	<TR height="20" align="center">
		<TD>0~2000</TD>
		<TD>2000~4000</TD>
		<TD>4000~6000</TD>
		<TD>6000~8000</TD>
		<TD>8000~10000</TD>
		<TD>10000~</TD>
	</TR>
</TABLE>
      
        
      </td>
      </tr>
      
      
      
      </table>  
         
      <script>
         filter(null);
         
      </script>
 
      
  </body>
</html>
